@import '../../styles/theme.scss';
@import "~taro-ui/dist/style/components/icon.scss";
@import "~taro-ui/dist/style/components/input.scss";
@import "~taro-ui/dist/style/components/tag.scss";

.search_page {
  padding: 0 60px 24px;

  .search_tabbar {
    width: 100%;
    display: flex;
    align-items: center;

    .at-input {
      margin-left: 0;
    }

    .at-input:after {
      display: none;
    }

    .at-input__container {
      padding-left: 0;
    }

    .at-input__input {
      width: 370px;
      height: 64px;
      border: 1px solid #666;
      border-radius: 64px;
      padding: 0 24px 0 80px;
    }

    .search_cancel {
      color: $primary-color;
      font-size: 28px;
      flex: 1;
      text-align: right;
      font-weight: bold;
    }

    .at-icon {
      transform: translatex(-460px);
      color: #666;
      font-size: 32px;
    }
  }

  .search_recent_tags {
    padding: 14px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;

    .search_recent_tags-item {
      margin-right: 18px;
      background-color: $text-color-light;
      border-color: $text-color-light;
      height: 56px;
      line-height: 56px;
      font-size: 28px;
      padding: 0 18px;
      margin-bottom: 24px;
    }
  }

  .search_recent_wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    .search_recent_wrapper_item {
      width: 50%;
      color: $text-color-light;
      font-weight: 650;
      font-size: 28px;
      margin-bottom: 30px;
    }
  }

  .search_recent {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: $primary-color;
    // margin-bottom: 16px;
    padding: 36px 0;

    .search_recent_title {
      font-size: 34px;
      font-weight: 700;
    }

    .search_recent_clear {
      font-size: 28px;
      font-weight: 700;
    }
  }
}
